
<template>
  <hr>
  <button @click="getData">get method</button>
  <button @click="exit">退出登录</button>

  <!-- list ==> {{ list }} -->

  <!-- <div class="page2">
    <a-button @click="getActivityList">page2</a-button>
    <p>
      {{ page2List }}
    </p>
  </div> -->


  <!-- <a-table :columns="column" :dataSource="list">
    <template #type="{record}">
      {{activityType[record.type]}}
    </template>
    <template #status="{record}">
      {{statusType[record.status]}}
    </template>
    <template #actions>
      <a href="">查看</a>
    </template>
  </a-table> -->

  <ui-table :columns="column" :dataSource="list">
    <template #type="{record}">
      {{activityType[record.type]}}
    </template>
    <template #status="{record}">
      {{statusType[record.status]}}
    </template>
    <template #actions>
      <a href="">查看</a>
    </template>
  </ui-table>

  <a-button @click="getInfoState">getInfoState</a-button>
  <p>{{ InfoState }}</p>

  <a-button @click="getInfoGetter">getInfoGetter</a-button>
  <p>{{ InfoGetter }}</p>

  <ul>
    <li v-for="item in InfoGetter" :key="item.key">{{item.value}}</li>
  </ul>

</template>

<script lang="ts">
import { reactive, defineComponent, toRefs, ref, onMounted } from 'vue'
import {Vue} from 'vue-class-component'
import axios from 'axios'
// import http from "@/request"
import { http } from "@/request"
import useActivity from '@/hooks/useActivity'
import uiTable from "@/components/ui-table/index.vue"
import store from '@/store'


// export default class Test extends Vue{}
export default defineComponent({
  components: {
    uiTable
  },
  setup(props){
    enum activityType {
      '领券类' = 1,
      '自动触发类' = 2,
    }
    enum statusType {
      '关闭',
      '开启',
    }
    let list = ref([])
    const getData = () => {
      console.log(props);
       
      http("GET_ACTIVITY_PAGE").then((res: any) => {
        // console.log("list ==> ", res);
        list.value = res.result.results
      }).catch((err:any) => { 
        console.log("err ==> ", err);
      })
      // http("GET_USER_HOST")
    }

    // const { getActivityList, list: page2List } = useActivity()

    let column = [
      {
        title: "id",
        dataIndex: "id"
      },
      {
        title: "活动名称",
        dataIndex: "name",
      },
      {
        title: "类型",
        dataIndex: "type",
        slots: {
          customRender: "type"
        }
      },
      {
        title: "状态",
        dataIndex: "status",
        slots: {
          customRender: "status"
        }
      },
      {
        title: "开始时间",
        dataIndex: "startTime",
      },
      {
        title: "结束时间",
        dataIndex: "endTime",
      },
      {
        title: "操作",
        // dataIndex: "actions",
        slots: {
          customRender: "actions"
        }
      },
    ]

    onMounted(() => {
      // getData()
    })

    const exit = () => {
      const elm = document.head.appendChild(document.createElement('script'))
      // const elm = document.createElement('img')
      const callbackName = "nk_admin"

      elm.src = `http://user.nk.md/admin/logout?jsonpCallback=${callbackName}`

      window[callbackName] = function(res: any){
        const {ssoUrls} = res.result
        let num = ssoUrls.length
        ssoUrls.map((url: any) => {
          const img = new Image()
          img.src = url
          img.onerror = () => {
            --num
            if(num === 0){
              location.replace("http://user.nk.md/#/admin/login?goto=" + encodeURIComponent(location.href))
            }
          }
          console.log("url ==. ", url);
          
        })
      }      
    }

    const InfoState = ref([])
    const getInfoState = () => {
      console.log("store.state ", store.state["activity_type"]);
      InfoState.value = store.state["activity_type"]
      // InfoState.value = 
    }

    const InfoGetter = ref([])
    const getInfoGetter = () => {
      // console.log("store.getters", store.getters);
      InfoGetter.value = store.getters['activity_type']
    }

    return{
      getData,
      // ...toRefs(list),
      list,
      // getActivityList,
      // page2List,
      activityType,
      column,
      statusType,
      exit,
      InfoState,
      getInfoState,
      InfoGetter,
      getInfoGetter,
    }
  }
})
</script>